﻿<!DOCTYPE html>
<html>
<!--http://blogs.msdn.com/b/giorgio/archive/2011/08/07/bing-maps-add-support-for-html5-geolocation.aspx-->
<!--http://msdn.microsoft.com/en-us/library/gg593067(v=VS.85).aspx-->
<head>
    <title>DAENET - GeoLocation Sample</title>
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
    <script type="text/javascript">

        var m_Map;

        function onGeoError(error) {
            m_TraceBox.value = error;
        }

        function showPosition(location) {

            try {

                m_Map.entities.clear();
                var pushpin = new Microsoft.Maps.Pushpin(m_Map.getCenter(), null);
                m_Map.entities.push(pushpin);
                pushpin.setLocation(new Microsoft.Maps.Location(location.coords.latitude, location.coords.longitude));

                var options = m_Map.getOptions();
                options.center = new Microsoft.Maps.Location(location.coords.latitude, location.coords.longitude);
                //options.zoom = 11
                m_Map.setView(options);
            }
            catch (err) {
                m_TraceBox.value = err;
            }
        }

        var watchId;

        function startWatching() {

            watchId = navigator.geolocation.watchPosition(showPosition);
        }

        function stopWatching() {

            var txt = document.getElementById("m_TraceBox");
            txt.value = "";
            navigator.geolocation.clearWatch(watchId);
        }


        function showMap() {

            try {

                m_TraceBox.value = "showMap eneterd";

                // Set the map and view options, setting the map style to Road and
                //    removing the user's ability to change the map style
                var mapOptions = { credentials: "enter your credentials here: https://www.bingmapsportal.com/",
                    height: 1200,
                    width: 1200,
                    mapTypeId: Microsoft.Maps.MapTypeId.road,
                    showMapTypeSelector: false,
                    zoom: 14
                };

                // Initialize the map
                m_Map = new Microsoft.Maps.Map(document.getElementById("myMap"), mapOptions);

                startWatching();
            }
            catch (error) {
                m_TraceBox.value = error;
            }
        }

    </script>
</head>
<body onload="showMap();">
    <div id='myMap' style="position: relative;">
    </div>
    <input type="text" id="m_TraceBox" />
</body>
</html>
